<!DOCTYPE html>
<html>

	<head>
		<title>私信</title>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
		<link rel="stylesheet" href="/js/bootstrap/css/bootstrap.min.css">
		<script src="/js/jquery/jquery.min.js"></script>
		<script src="/js/bootstrap/js/bootstrap.js"></script>
		<link rel="stylesheet" href="/css/font/css/font-awesome.min.css" />
		<link rel="stylesheet" href="/css/reset.css" />
		<link rel="stylesheet" href="/css/message.css" />
		<script src="../../js/plugins/jrender/jrender.min.js"></script>
		<link rel="stylesheet" href="../../js/emoji/myemojiPl.css">
		<script src="../../js/emoji/myemojiPl.js"></script>
		<script src="/js/plugins/dialog2/dialog.min.js"></script>
		<link rel="stylesheet" href="/js/plugins/dialog2/dialog.css">

		<script>

			$(function () {

                // 获得当前用户id
                var user = JSON.parse(sessionStorage.getItem("user"));
                var userId = user.id;
                var userHeadUrl = user.headImgUrl;

                // 拿到目标的id
                var params = getParams();
                var targetId = params.userId;
                console.log(targetId);

                // 查询两人所有私信
                var comment = $.ajax({
                    "dataType": 'json',
                    "url": "/letter/getDoubleLetters",
                    "data": {"userId": userId,targetId:targetId},
                    "success": function (data) {
                        console.log(data);
                        if(data == ""){
                            $(".letters").detach();
							$.get("/users/"+targetId,function (data) {
                                console.log(data);
                                $("#notme").html(data.nickName);
                            })

						}
                        var html="";
                        $.each(data,function (index, value) {

                            $("#notme").html(value.sendername);
                            //  左边是自己
							if(userId != value.receiverId) {
                                html += '<dd>' +
                                    '<span><img src=' + userHeadUrl + ' width="20px"></span>' +
                                    '</br> &gt;&gt;' +
                                    '<p >' + value.content + '</p>' +
                                    '<span>' + value.sendertime + '</span>' +
                                    '</dd>' +
                                    '<hr style="margin-right: 0px">';
                                return;
                            }

							//  右边是别人
							if(userId == value.receiverId){
                                html += '<br>' +
                                    '&nbsp;&nbsp;<span class="notme"><img src=' + value.senderHeadUrl + ' width="20px" ></span>' +
                                    '<p class="notme">'+value.content+'</p></br>' +
                                    '<span class="time">'+value.sendertime+'</span>' +
                                    '</dd>'+
                                    '<hr width="80%" style="margin-right: 0px">';
                            }
                        })

						$(".letters").append(html)
                    }
                });



                // 定时查询有没有未读消息

                var t=setInterval(realTimeGetComment2, 2000);//每隔2秒，查询一次
                var req = null;
                function realTimeGetComment2() {
                    $(".letters").html("");
                    if(req != null){
                        req.abort();
                        req = null;
                    }

                    $.ajax({
                        "dataType": 'json',
                        "type":"GET",
                        "url": "/letter/getDoubleLetters",
                        "data": {"userId": userId,targetId:targetId},

                        "success": function (data) {

                            if(data == null){
                                $(".letters").detach();
                            }
                            var html="";
                            $.each(data,function (index, value) {
                                //console.log(state);
                                $("#notme").html(value.sendername);
                                //  左边是自己
                                if(userId != value.receiverId) {
                                    html += '<dd>' +
                                        '<span><img src=' + userHeadUrl + ' width="20px"></span>' +
                                        '</br> &gt;&gt;' +
                                        '<p >' + value.content + '</p>' +
                                        '<span>' + value.sendertime + '</span>' +
                                        '</dd>' +
                                        '<hr style="margin-right: 0px">';
                                    return;
                                }

                                //  右边是别人
								if(userId == value.receiverId){
                                html += '<br>' +
                                    '&nbsp;&nbsp;<span class="notme"><img src=' + value.senderHeadUrl + ' width="20px" ></span>' +
                                    '<p class="notme">'+value.content+'</p></br>' +
                                    '<span class="time">'+value.sendertime+'</span>' +
                                    '</dd>'+
                                    '<hr width="80%" style="margin-right: 0px">';
									return;
                                }

                            })

                            $(".letters").append(html)
                        },

                        // 失败提示
                        error:function(){
                            console.log("实时信息，请求失败");
                            clearTimeout(t);
                        }
                    });
                }

                /* -----------------发送私信-------------*/
                var content;
                $(".postBtn").click(function () {
                    content = $(".Input_text").html();
                    $.post("/letter/insertLetter",{content:content,receiverId:targetId},function (data) {
                        if(data.success){
                            $(document).dialog({
                                type : 'toast',
                                infoIcon: '/img/icon/success.png',
                                infoText: '发送成功',
                                autoClose: 1000,
                            });
                            setTimeout(function () {
                                // 侧边栏登陆的时候,使用父窗口登陆
                                window.location.reload();
                            },1500);
                        } else {
                            $(document).dialog({
                                autoClose: 2000,
                                content: data.msg,
                            });
                        }
                    })
                })
				//  返回个人页面
				$("#RuerPWithId").click(function () {
					window.location.href="/userProfiles.html?userId="+targetId;
                })
            })
		</script>

<style>
	.notme{
		float: right;
		margin-right: 10px;

	}
	.time{
		float: left;
		width: 350px;
		text-align: center;
	}

	body{
		padding-bottom:50px;
	}
	.Main{
		position:fixed;
		left:0px;
		bottom:10px;
		width:100%;
		height:150px;
		background-color:#000;
		z-index:9999;
	}

</style>
		<link rel="stylesheet" href="../../js/plugins/dialog2/dialog.css">
		<script src="../../js/plugins/dialog2/dialog.min.js"></script>
		<script src="../../js/common.js"></script>

	</head>

	<body>

	<div class="search-head">
		<div class="row nav-search choseState">
			<div class="col">
				<span id="RuerPWithId"><a href="javascript:;"><i class="fa fa-chevron-left" ></i></a></span> <span id="notme">maya</span>
			</div>
			<div class="col">
				<span>私信消息</span>
			</div>
			<div class="col"></div>
		</div>
	</div>


	</div>
        <div class="container letters">
            <!--<dl class="itemList" render-loop="list">
                <dd>
					<span class="badge badge-danger badge-pill dot" set-fun=".dot" render-key="list.state" >未读</span>
                    <span><img render-src="list.headImgUrl" width="20px"></span>
                    <span render-html="list.username"></span> <span>评论了你的游记 : <a render-html="list.targetname"></a></span>
					<p render-html="list.content"></p>
                    <span render-html="list.create_time"></span>
                </dd>
            </dl>-->
        </div>

	<div class="Main" style="margin-bottom: 0px">



		<div class="Input_Box">
			<div contenteditable="true" class="Input_text"></div>
			<div class="Input_Foot">
				<a class="imgBtn" href="javascript:void(0);">'◡'</a><a class="postBtn">确定</a>
			</div>
		</div>

		<div class="faceDiv">
			<section class="emoji_container">
			</section>
			<section class="emoji_tab"></section>
		</div>

	</div>

	<script src="/js/emoji/myemojiPl.js"></script>
	<script>
        var emojiconfig = {
            tieba: {
                name: "贴吧表情",
                path: "img/tieba/",
                maxNum: 50,
                file: ".jpg",
                placeholder: ":{alias}:",
                alias: {
                    1: "hehe",
                    2: "haha",
                    3: "tushe",
                    4: "a",
                    5: "ku",
                    6: "lu",
                    7: "kaixin",
                    8: "han",
                    9: "lei",
                    10: "heixian",
                    11: "bishi",
                    12: "bugaoxing",
                    13: "zhenbang",
                    14: "qian",
                    15: "yiwen",
                    16: "yinxian",
                    17: "tu",
                    18: "yi",
                    19: "weiqu",
                    20: "huaxin",
                    21: "hu",
                    22: "xiaonian",
                    23: "neng",
                    24: "taikaixin",
                    25: "huaji",
                    26: "mianqiang",
                    27: "kuanghan",
                    28: "guai",
                    29: "shuijiao",
                    30: "jinku",
                    31: "shengqi",
                    32: "jinya",
                    33: "pen",
                    34: "aixin",
                    35: "xinsui",
                    36: "meigui",
                    37: "liwu",
                    38: "caihong",
                    39: "xxyl",
                    40: "taiyang",
                    41: "qianbi",
                    42: "dnegpao",
                    43: "chabei",
                    44: "dangao",
                    45: "yinyue",
                    46: "haha2",
                    47: "shenli",
                    48: "damuzhi",
                    49: "ruo",
                    50: "OK"
                },
                title: {
                    1: "呵呵",
                    2: "哈哈",
                    3: "吐舌",
                    4: "啊",
                    5: "酷",
                    6: "怒",
                    7: "开心",
                    8: "汗",
                    9: "泪",
                    10: "黑线",
                    11: "鄙视",
                    12: "不高兴",
                    13: "真棒",
                    14: "钱",
                    15: "疑问",
                    16: "阴脸",
                    17: "吐",
                    18: "咦",
                    19: "委屈",
                    20: "花心",
                    21: "呼~",
                    22: "笑脸",
                    23: "冷",
                    24: "太开心",
                    25: "滑稽",
                    26: "勉强",
                    27: "狂汗",
                    28: "乖",
                    29: "睡觉",
                    30: "惊哭",
                    31: "生气",
                    32: "惊讶",
                    33: "喷",
                    34: "爱心",
                    35: "心碎",
                    36: "玫瑰",
                    37: "礼物",
                    38: "彩虹",
                    39: "星星月亮",
                    40: "太阳",
                    41: "钱币",
                    42: "灯泡",
                    43: "茶杯",
                    44: "蛋糕",
                    45: "音乐",
                    46: "haha",
                    47: "胜利",
                    48: "大拇指",
                    49: "弱",
                    50: "OK"
                }
            },
            AcFun:{
                name : "AcFun表情",
                path : "img/AcFun/",
                maxNum : 54,
                file : ".png"
            }
        };
        $('.Main').myEmoji({emojiconfig : emojiconfig});
	</script>


	</body>

</html>